<template>
    <div class="myorder">
        <hb-title-levels :list="pathList" />

        <div class="table">
            <ul class="thead fcb">
                <li class="ilbk" v-for="(v, i) in headList" :key="i" v-text="v" :style="{width: tdwidths[i] + 'px'}"></li>
            </ul>
            <c-table class="stable" :tdwidths="tdwidths" :dataList="dataList" />
        </div>
    </div>
</template>

<script>
import Ctable from '../c-table'
import Lang from './lang.js'
import {vpost, vlink} from '@api'
export default {
	name: 'myorder',
	data() {
		return {
			Lang,
			tdwidths: [120, 80, 80, 180, 120, 120, 120, 160, 160],
			dataList: [],
		}
	},
	components: {
		'c-table': Ctable,
	},
	mounted() {
		this.handle()
	},
	computed:{
		headList(){
			return this.Lang.titleHead[this.$store.state.setting.lang]
		},
		pathList(){
			return [{path: 'c2c', txt: this.Lang.changeemail[this.$store.state.setting.lang][0]}, {path: '', txt: this.Lang.changeemail[this.$store.state.setting.lang][1]}]
		}
	},
	methods: {
		handle() {
			vpost(vlink.ddd.queryAdvertByUser).then(re => {
				if (re != null && re.status === '1') {
					this.dataList = re.data.pointOrderList
				}
			})
		},
	},
}
</script>

<style scoped>
.table {
	margin: 0 auto;
	width: 1200px;
	color: var(--clr2);
}
.thead {
	border-bottom: 1px solid gray;
	padding: 10px 0;
	text-align: left;
}
li:last-of-type {
	flex-grow: 1;
	text-align: right;
}
.stable {
	width: 100%;
}
</style>
